<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<script src="http://code.jquery.com/jquery-latest.js"></script>
	<style type="text/css">
		body, html { font-family:helvetica,arial,sans-serif; font-size:90%; width:500; height:500;}
		/*div {
			display: none;
		}*/
	</style>
</head>

<script>
/*
Communication with server:
1.	Send: status -> init / link
	Receive: error, not_loged_in, exist/verb/category/name, not exist
2.	Send: status -> insert, verb / category / link
	Receive: success , error
3.	Send: status-> delete , link
	Receive: success, error

on click verb -> send to server to insert or update -> slide down message

on click wall -> on click delete -> send to server and print the one or the other message

on click not_you -> redirect

select category -> change verbs

*/

jQuery(document).ready(function(){

	var link;
	var GlobalCategory;

	/*GET TAB URL*/
	chrome.tabs.getSelected(null, function(tab) {
		 Main(tab.url);
	});
	

 	function WallPost() {
		// 	SEND THE URL TO SERVER
		var dataString = "Link="+link;
		var url = "http://cyberang3l.ath.cx:33335/ExtResponse/IntoThisWallPost.php?"+dataString;
		// 		GET THE RESPONE FROM SERVER
		$.getJSON(url + "&jsoncallback=?", function(data){
			Status = data.Status;
			if (Status == "success") $("#wall").show("slow").siblings().hide("slow");
			else $("#error").show("slow").siblings().hide("slow");
		})
		return false;
 	}
// 	
 	function DeleteLink() {
// 		// 	SEND THE URL TO SERVER
		var dataString = "Link="+link;
		var url = "http://cyberang3l.ath.cx:33335/ExtResponse/IntoThisDelete.php?"+dataString;
// 		// 		GET THE RESPONE FROM SERVER
		$.getJSON(url + "&jsoncallback=?", function(data){
			Status = data.Status;
			if (Status == "success") {
				$("#delete").show("slow").siblings().hide("slow");
				setTimeout("location.reload(true)", 3000);
			}
			else $("#error").show("slow").siblings().hide("slow");
			
		})
		return false;
	}


// 	On Click of Post to Wall and Delete Icons!
	$("a.icons").click(function () {
		var divname= $(this).attr("value");
		if (divname=="delete") DeleteLink();
		else if (divname=="wall") WallPost();
	});


	$("[name='verb']").hover(
		function () {
			this.style.cursor='pointer' 
			this.style.background='#FFFF00';
		}, 
		function () {
			this.style.background='#FFFFFF';
	});


	function verbs(category, verb11,verb12, verb21,verb22,verb31,verb32)
	{
		this.category=category;
		this.verb11=verb11;
		this.verb12=verb12;
		this.verb21=verb21;
		this.verb22=verb22;
		this.verb31=verb31;
		this.verb32=verb32;
	}

	// 3 verb CATEGORIES!
	var categoryArray = new Array(3);

	// CATEGORY <GENERAL / QUESTION / KNOWLEDGE> -> I AM INTO THIS
	categoryArray[0]=new verbs("General", "I am into this", "is into this", "null", "null", "null", "null");

	// CATEGORY <PLACE> -> I HAVE BEEN THERE / I WANT TO GO THERE
	categoryArray[1]=new verbs("Place", "I have been there", "has been there", "I want to go there", "wants to go there", "null","null");

	// CATEGORY <COMPANY> -> I WORK HERE, I AM A CUSTIMER HERE
	categoryArray[2]=new verbs("Company", "I work", "works", "I am a customer", "is a customer", "I own this", "owns this");


	function VerbsDisplay(Category) {
		var verbsArray = new Array(3);
		var i;
		for (i=0 ; i<categoryArray.length ; i++ ) {
			if (categoryArray[i].category==Category) {
				verbsArray[0] = categoryArray[i].verb11;
				verbsArray[1] = categoryArray[i].verb21;
				verbsArray[2] = categoryArray[i].verb31;
				break;
			}
		}
		var i = 0;
		var length = verbsArray.length;
		$("[name='verb']").each(function() {
			if (i < length && verbsArray[i]!="null") {
				$(this).html('<span><li>'+verbsArray[i]+'</li></span>');
			}
			i+=1;
		});
// 
		jQuery("#verbs").show();

	}


	function CategorySelection(Category, Verb) {
		$("[value='"+Category+"']").attr("selected", "selected");
		jQuery("#category_select").show();
		GlobalCategory = Category;

		/*Display Verbs*/
		VerbsDisplay(Category);
	}

	$("#categories").change(function() {
		VerbsDisplay(this.value);
		GlobalCategory = this.value;
	});


	/*On click of a verb send to server for insertion*/
	$("[name='verb']").click(function () {
		var verb = $(this).html();
		verb=verb.substring(10 , verb.length-12);
		// SEND THE URL TO SERVER - STATUS = INIT
		var dataString = "status=insert"+"&link="+link+"&verb="+verb+"&category="+GlobalCategory;
		var url = "http://cyberang3l.ath.cx:33335/ExtResponse/IntoThisResponse.php?" + dataString;
		
		// GET THE RESPONE FROM SERVER
		$.getJSON(url + "&jsoncallback=?", function(data){
			Status = data.Status;
			Username = data.Username;
			Login = data.Login;
			NotYou = data.NotYou;
			Verb = data.Verb;
			Category = data.Category;
			if (Status == "success_insertion") {
				/*Find the appropriate Verb!*/
				var i;
				var IsVerb;
				for (i=0 ; i<categoryArray.length ; i++ ) {
					if (categoryArray[i].category==GlobalCategory) {
						if (verb == categoryArray[i].verb11) IsVerb = categoryArray[i].verb12;
						else if (verb == categoryArray[i].verb21) IsVerb = categoryArray[i].verb22;
						else if (verb == categoryArray[i].verb31) IsVerb = categoryArray[i].verb32;
						else IsVerb=("An Error Occured!");
						break;
					}
				}
				
				jQuery("#msg_insert").html(Username.split(" ",1)+" "+IsVerb+" <img src='check.jpg'/>");
				$('#msg_insert').slideDown('slow', function() {
					$('#WallDeleteIcons').show();
				});
			}
			else {
				ServerError();
			}
		});
	});



	function NotLoggedIn(Login) {
		$("#login").html('<a href="'+Login+'" target="_blank">Please Login to Continue!</a>');
		$("#login").show();
	}

	function NotExist(Username, NotYou) {
		$("#login").html(Username+'<a href="'+NotYou+'" target="_blank">'+'  '+'Not You?</a>');
		$("#login").show();
		CategorySelection("General", "I am into this");
	}

	function Exist(Username,NotYou, Category, Verb) {
		$("#login").html(Username+'<a href="'+NotYou+'" target="_blank">Not You?</a>');
		$("#login").show();
		CategorySelection(Category, Verb);
		var i;
		var IsVerb;
		for (i=0 ; i<categoryArray.length ; i++ ) {
			if (categoryArray[i].category==Category) {
				if (Verb == categoryArray[i].verb11) IsVerb = categoryArray[i].verb12;
				else if (Verb == categoryArray[i].verb21) IsVerb = categoryArray[i].verb22;
				else if (Verb == categoryArray[i].verb31) IsVerb = categoryArray[i].verb32;
				else IsVerb=("An Error Occured!");
				break;
			}
		}
		
		jQuery("#msg_insert").html(Username.split(" ",1)+" "+IsVerb+" <img src='check.jpg'/>");
		$('#msg_insert').slideDown('slow', function() {
				$('#WallDeleteIcons').show();
		});
	}

	function ServerError() {
		$("#login").html('An error occured! Please try again!');
		$("#login").show();
	}

	function Main(url) {
		/*Save the tab url!*/
		link = url;

		/*Check if AskMyFriends extension is installed*/
		var port = chrome.extension.connect("hkfofinljmeoainkinmoionchfofdlob");
		port.onDisconnect.addListener(function(msg) {
			$("#installation_expected").show();
			return ;
		});
		
		// SEND THE URL TO SERVER - STATUS = INIT
		var dataString = "status=init"+"&link="+link;
		var url = "http://cyberang3l.ath.cx:33335/ExtResponse/IntoThisResponse.php?" + dataString;
		
		// GET THE RESPONE FROM SERVER
		$.getJSON(url + "&jsoncallback=?", function(data){
			Status = data.Status;
			Username = data.Username;
			Login = data.Login;
			NotYou = data.NotYou;
			Verb = data.Verb;
			Category = data.Category;
			if (Status == "not_logged_in") {
				NotLoggedIn(Login);
			}
			else if (Status == "exist") {
				Exist(Username, NotYou, Category, Verb);
			}
			else if (Status == "not_exist") {
				NotExist(Username, NotYou);
			}
			else {
				ServerError();
			}
		});
	}
});


</script>


<body>

<!-- 	INSTALL -ASK MY FRIENDS- EXTENSION  / LOGIN TO CONTINUE!  -->
	<div id="installation_expected"  style="display:none;">
		Install extension to continue!
	</div>

<!-- 	USER CHECK - <NOT YOU?> -->
	<div id="login" style="display:none;float:right;font-size:10px;width:110px;">
		
	</div>


<!-- VERB CATEGORY SELECTION -->
	<div id="category_select" style="display:none;font-size:10px;">
		<br>
		<select id="categories">
			<option value="General">General</option>
			<option value="Place">Place</option>
			<option value="Company">Company</option>
		</select>
	</div>

<!-- 	VERB BUTTONS! -->
	<div id="verbs" style="display:none;" >
		<div name="verb" id="verb1" style="width:200px;">
			
		</div>
		<div name="verb" id="verb2" style="width:200px;">

		</div>
		<div name="verb" id="verb3" style="width:200px;">

		</div>
	</div>
	

<!-- 	INSERTION DONE -->
	<div id="msg_insert" style="font-size:15px;display:none;width:200px;">

	</div>


<!-- 	OPTIONS: Post to Wall - Delete a link!   -->
	<div id="WallDeleteIcons" style="float:right;display:none;"> 
		<a id="Delete" value="delete" class="icons"><img src="X.gif" title="Delete" /></a>
		<a id="Wall" class="icons" value="wall"><img src="wall.jpg" title="Post on Wall" /></a>
	</div>
	<div>
		<div id="delete" style="display:none">
			Deletion in process. Please wait!
		</div>

		<div id="wall" style="display:none">
			Successfully Posted on your Wall!
		</div>
		<div id="error" style="display:none">
			An error occured. Please try again!
		</div>
	</div>
</body>
</html>